VimŸUnDoåZýö‚âîxÆé¾ù„Ñ5_ÐÿÿÿÿgëË*õ + class ChatApp extends HTMLElement {5_Ð ÿÿÿÿgëË*õ constructor() {5_Ð ÿÿÿÿgëË*õ super();5_Ð ÿÿÿÿgëË*õ 4 this.attachShadow({ mode: 'open' });5_Ð ÿÿÿÿgëË*õ this.render();5_Ð ÿÿÿÿgëË*õ % this.initWebSocket();5_Ð ÿÿÿÿgëË*õ % this.makeDraggable();5_Ð ÿÿÿÿgëË*õ }5_ÐÿÿÿÿgëË*õ 5_ÐÿÿÿÿgëË*õ render() {5_ÐÿÿÿÿgëË*õ - this.shadowRoot.innerHTML = `5_ÐÿÿÿÿgëË*õ 5_Ð=?>ÿÿÿÿgëË0õ % 5_ÐEGFÿÿÿÿgëË0õ =

5_ÐFHGÿÿÿÿgëË0õ .

5_ÐGIHÿÿÿÿgëË0õ A 5_ÐHJIÿÿÿÿgëË1õ P 5_ÐIKJÿÿÿÿgëË1õ

5_ÐJLKÿÿÿÿgëË1õ `;5_ÐKMLÿÿÿÿgëË1õ 5_ÐLNMÿÿÿÿgëË1õ C this.chat = this.shadowRoot.getElementById('chat');5_ÐMONÿÿÿÿgëË1õ E this.input = this.shadowRoot.getElementById('input');5_ÐNPOÿÿÿÿgëË1õ I this.sendButton = this.shadowRoot.getElementById('send');5_ÐOQPÿÿÿÿgëË1õ K this.themeSelect = this.shadowRoot.getElementById('theme');5_ÐPRQÿÿÿÿgëË1õ 5_ÐQSRÿÿÿÿgëË1õ T this.sendButton.addEventListener('click', () => this.sendMessage());5_ÐRTSÿÿÿÿgëË1õ V this.themeSelect.addEventListener('change', () => this.changeTheme());5_ÐSUTÿÿÿÿgëË2õ }5_ÐTVUÿÿÿÿgëË2õ 5_ÐUWVÿÿÿÿgëË2õ initWebSocket() {5_ÐVXWÿÿÿÿgëË2õ B this.ws = new WebSocket('ws://localhost:8080/ws');5_ÐWYXÿÿÿÿgëË2õ 5_ÐXZYÿÿÿÿgëË2õ 0 this.ws.onmessage = (event) => {5_ÐY[ZÿÿÿÿgëË2õ B const message = document.createElement('div');5_ÐZ\[ÿÿÿÿgëË2õ 5 message.textContent = event.data;5_Ð[]\ÿÿÿÿgëË2õ 3 this.chat.appendChild(message);5_Ð\^]ÿÿÿÿgëË2õ P this.chat.scrollTop = this.chat.scrollHeight; // Auto-scroll5_Ð]_^ÿÿÿÿgëË2õ };5_Ð^`_ÿÿÿÿgëË2õ }5_Ð_a`ÿÿÿÿgëË3õ 5_Ð`baÿÿÿÿgëË3õ sendMessage() {5_ÐacbÿÿÿÿgëË3õ 1 const message = this.input.value;5_ÐbdcÿÿÿÿgëË3õ if (message) {5_ÐcedÿÿÿÿgëË3õ * this.ws.send(message);5_ÐdfeÿÿÿÿgëË3õ F const userMessage = document.createElement('div');5_ÐegfÿÿÿÿgëË3õ @ userMessage.textContent = `You: ${message}`;5_ÐfhgÿÿÿÿgëË3õ 7 this.chat.appendChild(userMessage);5_ÐgihÿÿÿÿgëË3õ P this.chat.scrollTop = this.chat.scrollHeight; // Auto-scroll5_ÐhjiÿÿÿÿgëË3õ * this.input.value = '';5_ÐikjÿÿÿÿgëË3õ }5_ÐjlkÿÿÿÿgëË3õ }5_ÐkmlÿÿÿÿgëË3õ 5_ÐlnmÿÿÿÿgëË4õ changeTheme() {5_ÐmonÿÿÿÿgëË4õ = this.chat.className = this.themeSelect.value;5_ÐnpoÿÿÿÿgëË4õ }5_ÐoqpÿÿÿÿgëË4õ 5_ÐprqÿÿÿÿgëË4õ makeDraggable() {5_ÐqsrÿÿÿÿgëË4õ H const header = this.shadowRoot.getElementById('header');5_ÐrtsÿÿÿÿgëË4õ ' let isDragging = false;5_ÐsutÿÿÿÿgëË4õ , let offset = { x: 0, y: 0 };5_ÐtvuÿÿÿÿgëË4õ 5_ÐuwvÿÿÿÿgëË5õ = header.addEventListener('mousedown', (e) => {5_ÐvxwÿÿÿÿgëË5õ & isDragging = true;5_ÐwyxÿÿÿÿgëË5õ M offset.x = e.clientX - this.getBoundingClientRect().left;5_ÐxzyÿÿÿÿgëË5õ L offset.y = e.clientY - this.getBoundingClientRect().top;5_Ðy{zÿÿÿÿgëË5õ 5 header.style.cursor = 'grabbing';5_Ðz|{ÿÿÿÿgëË5õ });5_Ð{}|ÿÿÿÿgëË5õ 5_Ð|~}ÿÿÿÿgëË5õ < document.addEventListener('mouseup', () => {5_Ð}~ÿÿÿÿgëË5õ ' isDragging = false;5_Ð~€ÿÿÿÿgëË5õ 1 header.style.cursor = 'move';5_Ð€ÿÿÿÿgëË6õ });5_Ð€‚ÿÿÿÿgëË6õ 5_Ðƒ‚ÿÿÿÿgëË6õ ? document.addEventListener('mousemove', (e) => {5_Ð‚„ƒÿÿÿÿgëË6õ % if (isDragging) {5_Ðƒ…„ÿÿÿÿgëË6õ 9 this.style.position = 'absolute';5_Ð„†…ÿÿÿÿgëË6õ F this.style.left = `${e.clientX - offset.x}px`;5_Ð…‡†ÿÿÿÿgëË6õ E this.style.top = `${e.clientY - offset.y}px`;5_Ð†ˆ‡ÿÿÿÿgëË6õ }5_Ð‡‰ˆÿÿÿÿgëË6õ });5_ÐˆŠ‰ÿÿÿÿgëË6õ }5_Ð‰‹ŠÿÿÿÿgëË7õ }5_ÐŠŒ‹ÿÿÿÿgëË7õ 5_Ð‹ŒÿÿÿÿgëË8õ 3 customElements.define('chat-app', ChatApp);5_ÐŒŽÿÿÿÿgëË:õ 5_ÐŽ ÿÿÿÿgëËCõ 5_ÐŽ ÿÿÿÿgëËDõ õ 5_Ð‘ ÿÿÿÿgëÏ9õ+ 5_Ð’‘ +ÿÿÿÿgëÕRõ6 asfasfsaasf5_Ð‘“’ÿÿÿÿgëÕTõ 5_Ð’”“ ÿÿÿÿgë×-õ 5_Ð“•” ÿÿÿÿgë×çõ3 5_Ð”–• ÿÿÿÿgë×ìõD 5_Ð•—–ÿÿÿÿgëØ&õ - You are the spoke person of Molodetz.5_Ð–˜—ÿÿÿÿgëØ'õ 5_Ð—™˜!ÿÿÿÿgëØ.õ! Talk only about software.5_Ð˜š™ÿÿÿÿgëØ5õ 5_Ð™›šÿÿÿÿgëØ6õ õõ 5_Ðšœ›ÿÿÿÿgëØL õ5_Ð›œÿÿÿÿgëÜgõ 5_ÐœžÿÿÿÿgëÜhõ 5_ÐŸžÿÿÿÿgëÜlõ5_Ðž ŸÿÿÿÿgëÜn õ5_ÐŸ¡ ÿÿÿÿgëÜœõ * {5_Ð ¢¡ÿÿÿÿgëÜŸõ chat {5_Ð¡£¢ÿÿÿÿgëÜ¡õ padding: 10px;5_Ð¢¤£ÿÿÿÿgëÜ¡õ }5_Ð£¥¤ÿÿÿÿgëÜ¢õ 5_Ð¤¦¥ ÿÿÿÿgëÜØõ #chat {õ5_Ð¥§¦ÿÿÿÿgëÜâõ background-color: 000;5_Ð¦¨§ÿÿÿÿgëÜäõ background-color: 000;5_Ð§©¨ÿÿÿÿgëÜòõ #chat.theme-light {5_Ð¨ª© ÿÿÿÿgëÜõõ #chat-app {5_Ð©ªÿÿÿÿgëÜø õ background-color: #000;5çª